<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>列表</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/yzl.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/swiper.css"/>
    <style>
    .seckactive{
     border-bottom: 2px solid #9d0152;
    }
    .seckactive div{
    color:#9d0152;
   }
   #seckill_tap{
  position:relative;
  top:0;
  }
    </style>
</head>
<body>
<div id="app" v-cloak class="container">
    <div class="floor bdr-bottom"  id="seckill_tap" style="z-index:100;position:fixed;width:100%">
    <div class="seckill-floor" style="width:100%">
        <div class="swiper-container swiper-container-horizontal swiper-container-free-mode" style="width:100%;background:#ffffff;border-bottom:1px solid #e6e6e6;border-top:1px solid #e6e6e6">
            <div class="swiper-wrapper" style="transition-duration: 0ms; transform: translate3d(0px, 0px, 0px);width:100%" >
                <div class="swiper-slide" v-for="seckill_date in seckills.timearr" style="width:20%">
                    <div class="seckill-new-item" :class="{'seckactive':seckill_date.time_seckill==seckills.time_seckill}" v-myclick="[seckill_date.time_seckill, changeSeckill]">
                    <div><span>{{seckill_date.hour_seckill}}:00</span></div>
                    <div style="font-size:14px"> <span>{{seckill_date.state}}</span></div>
                    </div>
                </div>
            </div>
        </div>
  </div>
</div>
<div id="seckill-main" style="background:#ffffff;padding-top:56px">
<div class="seckill_goods1"  v-for="timearr in seckills.timearr" id="seckill_time_seckills">
  <div class="seckill_goods" v-if="timearr.time_seckill==seckills.time_seckill" v-for="(content, index) in timearr.goods" id="seckill_goods" style="width:95%;margin:0 auto">
    <div class="goods_container" :class="{'sold_out':seckills.time_seckill<=seckills.cur_time&&content.is_on_sale==0}">
      <div class="goods_image" v-myclick="(timearr.type==2||timearr.type==3)&&content.is_on_sale==1?[content.goods_id, openSeckillGoodsInfo]:''">
        <img :src="content.pic" >
      </div>
      <div class="goods_right">
        <div class="goods_title" v-myclick="(timearr.type==2||timearr.type==3)&&content.is_on_sale==1?[content.goods_id, openSeckillGoodsInfo]:''">{{content.title}}</div>
        <div class="goods_detail">
          <div class="goods_price" v-myclick="(timearr.type==2||timearr.type==3)&&content.is_on_sale==1?[content.goods_id, openSeckillGoodsInfo]:''"><span style="position:absolute;bottom:0px"><span>￥</span><span style="font-size:18px">{{content.price}}元</span></span></div>
          <div v-if="timearr.type==1" class="buy_button" style="background:#999999">已错过</div>
          <div v-if="(timearr.type==2||timearr.type==3)&&content.is_on_sale==1" class="buy_button" style="background:#9d0152" v-myclick="[content.goods_id, openGoodsDetail]">马上抢</div>
          <div v-if="timearr.type==4" class="remind"  v-bind:class="{'remind_active':content.remind==1}" v-myclick="[content, remind]">{{content.remind==1?'已设置提醒':'提醒我'}}</div>
          <div v-if="timearr.type!=4&&timearr.type!=1&&content.is_on_sale==0" class="buy_button" style="background:#999999">已售罄</div>
          <div style="clear:both"></div>
        </div>
        <div class="goods_sale">
          <div class="goods_prime">
            <del>￥{{content.prime}}</del>
          </div>
          <div class="goods_realprice">
            <span  v-if="seckills.time_seckill<=seckills.cur_time">已售{{content.sale_count}}件</span>
            <span v-if="seckills.time_seckill>seckills.cur_time" style="color:#0684FA">{{seckills.hour_seckill}}:00准时开抢</span>
          </div>
        </div>
      </div>
    </div>
    <img v-if="seckills.time_seckill<=seckills.cur_time&&content.is_on_sale==0" v-src="'../../image/sold_out.png'" style="width:80px;left:25px;position:absolute;top:20px;">
  </div>
  <div class="my-order-body" v-if="timearr.goods==''"  >
    <div style="text-align:center;padding-top: 60px;">
        <div style="text-align:center;padding-top: 70px;">
            <img v-src="'../../image/not_available.png'" width="70px" height="70px"/>
            <div style="padding-top:10px ">
                <span>暂无商品</span>
            </div>
        </div>
    </div>
</div>
</div>
</div>
<script src="../../script/api.js"></script>
<script src="../../script/vue.js"></script>
<script src="../../script/app.js"></script>
<script src="../../script/url.js"></script>
<script src="../../script/common.js"></script>
<script src="../../script/components.js"></script>
<script src="../../script/swiper.js"></script>
<script>
var seckills,
   swiper,
   slideindex,
   state,
   timetap,
   seckillheight,
   vm;

var wx;
apiready = function () {
   showProgress();
   wx = api.require('wx');
   setBSImg();
   var data = {
       member_id: getPrefs('member_id')
   };
   var callback = function (ret) {
       var home = ret.content;
       api.sendEvent({
           name: 'getUnReadMsgCount',
           extra: {count: home.unReadMessageCount}
       });
       seckills = home.homeSeckill;
       var seckill_goods = seckills.goods;
       for (var i = 0; i < seckills.timearr.length; i++){
           if(seckills.time_seckill == seckills.timearr[i].time_seckill){
               seckills.timearr[i].goods = seckill_goods;
           }
       };
       timetap = seckills.time_seckill;
       slideindex = seckills.index;
       initApp();
       api.parseTapmode();
       swiper();
   };
   pinet.post(URL.getSeckillList, data, callback);
   setRefreshHeaderInfo(refresh);
   addListeners();
};
function refresh() {
   var data = {
       member_id: getPrefs('member_id')
   };
   var callback = function (ret) {
       var home = ret.content;
       api.sendEvent({
           name: 'getUnReadMsgCount',
           extra: {count: home.unReadMessageCount}
       });
       seckills = home.homeSeckill;
       var seckill_goods = seckills.goods;
       for (var i = 0; i < seckills.timearr.length; i++){
           if(seckills.time_seckill == seckills.timearr[i].time_seckill){
               seckills.timearr[i].goods = seckill_goods;
           }
       };
       slideindex = seckills.index;
        timetap = seckills.time_seckill;
       if (vm) {
           vm.seckills = seckills;
           vm.key++;
       } else {
           initApp();
       }
       api.refreshHeaderLoadDone();
   };
   var errback = function () {
       api.refreshHeaderLoadDone();
   };
   pinet.post(URL.getSeckillList, data, callback, errback);
}

function initApp() {
   vm = new Vue({
       el: "#app",
       data: {
           seckills: seckills,
           slideindex:slideindex,
           url: URL.getSeckillList,
           BSImg: Vue.BSImg,
           key:0
       },
       methods: {
           openGoodsDetail: function (goods_id) {
             var attributes = {
                 category_id: vm.seckills.seckill_id,
                 goods_id:goods_id
             };
             onEvent('t002_c003_a001','抢购-时段-商品-购买',attributes);
             openWin('../home/browser', {goods_id: goods_id,buyshareeventId:'t002_c003_a003',category_id:vm.seckills.seckill_id,eventLable:'抢购-时段-商品-购买-分享'});
           },
           openSeckillGoodsInfo: function (goods_id) {
             var attributes = {
                 category_id: vm.seckills.seckill_id,
                 goods_id:goods_id
             };
             onEvent('t002_c003','抢购-时段-商品',attributes);
             openWin('../mall/seckill_goodsinfo', {goods_id: goods_id,category_id:vm.seckills.seckill_id});
           },
           changeSeckill: function (time) {
               showProgress();
               var data = {
                   seckilltime: time,
                   member_id: getPrefs('member_id')
               };
               var callback = function (ret) {
                 seckills = ret.content.homeSeckill;
                 var seckill_goods = seckills.goods;
                 for (var i = 0; i < seckills.timearr.length; i++){
                     if(seckills.time_seckill == seckills.timearr[i].time_seckill){
                         seckills.timearr[i].goods = seckill_goods;
                     }
                 }
                 vm.seckills = seckills;
                 timetap = seckills.time_seckill;
                 var attributes = {
                     category_id: seckills.seckill_id
                 };
                 onEvent('t002_c003','抢购-时段',attributes);
               };
               var errback = function () {
                   api.refreshHeaderLoadDone();
               };
               pinet.post(URL.getSeckillInfo, data, callback);
           },
           remind: function (good) {
               if(good.remind==1){
                 api.confirm({
                     title: '',
                     msg: "您确定要取消提醒吗？",
                     buttons: ['取消提醒', '再想想']
                 }, function (ret, err) {
                     var index = ret.buttonIndex;
                     if (index == 1) {
                        seckillRemind(timetap, good, 2);
                     }
                 });
               }else{
                 seckillRemind(timetap, good, 1);
               }

           },
       },
   })
}

function swiper(){
     swiper = new Swiper('.swiper-container', {
     pagination: '.swiper-pagination',
     slidesPerView: 5,
     paginationClickable: true,
     spaceBetween: 0,
     freeMode: true,
     resistanceRatio: 0,
 });
 swiper.slideTo(slideindex, 1000, false);
}
function addListeners() {
    api.addEventListener({
        name: 'home'
    }, function () {
        refresh();
    });
    api.addEventListener({
        name: 'viewappear'
    }, function () {
        onPageStart();
    });

    api.addEventListener({
        name: 'viewdisappear'
    }, function (ret, err) {
        onPageEnd();
    });

    api.addEventListener({
        name: 'keyback'
    }, function (ret, err) {
        onPageEnd();
        api.closeWin();
    });
}
</script>
</body>
</html>
